package com.example.navigation.components

import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.width
import androidx.compose.material3.DropdownMenu
import androidx.compose.material3.DropdownMenuItem
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

/**
 * Created with IntelliJ IDEA.
 * @Author: Liao Run
 * @Date: 2024-06-12 17:08
 * @Description:
 **/
@Composable
fun DropDownAreas(onSelected: (area: String) -> Unit) {
    val areaNames by remember {
        mutableStateOf(
            arrayOf(
                "锦江区",
                "青羊区",
                "金牛区",
                "武侯区",
                "成华区",
                "龙泉驿区",
                "青白江区",
                "新都区",
                "温江区",
                "双流区",
                "郫都区",
                "新津区",
                "简阳市",
                "都江堰市",
                "彭州市",
                "邛崃市",
                "崇州市",
                "金堂县",
                "大邑县",
                "蒲江县"
            )
        )
    }

    var expanded by remember {
        mutableStateOf(false)
    }

    var areaName by remember {
        mutableStateOf("")
    }

    Column {
        TextField(
            value = areaName,
            placeholder = {
                Text(text = "点击选择区域")
            },
            onValueChange = {},
            enabled = false,
            modifier = Modifier
                .clickable { expanded = true }
                .width(140.dp)
        )

        Box(modifier = Modifier) {
            DropdownMenu(
                expanded = expanded, onDismissRequest = { expanded = false },
                modifier = Modifier
                    .height(400.dp)
            ) {
                areaNames.map {
                    DropdownMenuItem(text = {
                        Text(text = it)
                    }, onClick = {
                        areaName = it
                        onSelected(it)
                        expanded = false
                    })
                }
            }
        }
    }
}